{% extends "base.html" %}

{% block content %}
<script type="text/javascript" src="/static/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="/static/js/jquery-ui-1.8.16.custom.min.js"></script>
<link href="/static/css/jquery-ui-1.8.16.custom.css" rel="stylesheet" type="text/css" />
<script language="javascript" type="text/javascript">
$(document).ready(
	function()
	{
	    $('#class_start').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
	    $('#class_end').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
		$('#dateofdefer').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
		$('#attoch').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
		$('#class_date3').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
	    $('#class_date4').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
		$('#class_date5').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
		{%for pcs in pcs_list%}
	    $('#class_start{{pcs.id}}').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
	    $('#class_end{{pcs.id}}').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
	    $('#dateofdefer{{pcs.id}}').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
	    $('#attoch{{pcs.id}}').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
		$('#class_date3{{pcs.id}}').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
	    $('#class_date4{{pcs.id}}').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
		$('#class_date5{{pcs.id}}').datepicker({"dateFormat": "dd/mm/yy",changeMonth:true,changeYear:true})
		{%endfor%}
	}
);
 function setvalue()
 {
	var a=document.getElementById('status').value;
	if(a!='Taiwan')
	{
		document.getElementById('taiwankemu').value='';
		document.getElementById('taiwankemu').ReadOnly=true;
	}
	else{
	document.getElementById('taiwankemu').ReadOnly=false;
	document.getElementById('taiwankemu').value='{{psc_obj.taiwankemu}}';
	}
 }
 </script>
<style type="text/css">
<!--
body,td,th {
	font-size: 12px;
}
.saminput{
width:80px;
}
-->
</style>
 <style>
 .list-div {
  width: 96%;
  border: 1px solid #BBDDE5;
}
.list-div table {
  border: 1px solid #BBDDE5;
}
.list-div th {
  line-height: 24px;
  background: #BBDDE5 url("/static/images/th_bg.gif") repeat-x;
  white-space: nowrap;
}

.list-div td {
  line-height: 22px;
}
tr.over td {background:#F4FAFB; 
} 
</style>
</head>

<body>
<div class="tab-div">
    <!-- tab bar -->
    <div id="tabbar-div">
      <p>
        <span class="tab-back"  id="detail-tab"><a href="/v2/edit_student/{{s_obj.id}}/">{%if s_obj.last_name%}{{s_obj.last_name}} , {{s_obj.first_name}}{%else%}{{s_obj.name_ch}}{%endif%} Profile</a></span><span
        class="tab-front"  id="general-tab">{%if s_obj.last_name%}{{s_obj.last_name}} , {{s_obj.first_name}}{%else%}{{s_obj.name_ch}}{%endif%} Program Enrolled</span><span
        class="tab-back" id="mix-tab"><a href="/v2/pay_record/{{s_obj.id}}/">{%if s_obj.last_name%}{{s_obj.last_name}} , {{s_obj.first_name}}{%else%}{{s_obj.name_ch}}{%endif%} Payment Record</a></span>
      </p>
    </div>
</div>	
<form name="saveenrool" method="post" >


<table width="100%" border="1" cellpadding="1" cellspacing="1" bordercolor="#64D5F0" bgcolor="#D1FAFE">
  <tr  style="background:#0099ff;color:#ffffff;">
    <td>Period</td>
    <td>Modules</td>
    <td>C/E</td>
    <!--<td>Course code</td>
    <td>Season</td>
    <td>Year</td>-->
    <td>Class Date</td>
    <td>Lecturer</td>
    <td>Textbook</td>
    <td>Venue</td>
    <td>Status</td>
    <td>Date Of Defer / Completed</td>
    <td>Course Material Sent</td>
  </tr>

  <tr>
    <td><input type="text" name="period" id="period" value="{{psc_obj.period}}" style="width:50px;" /></td>
    <td>
			<textarea name="modules" id="modules" cols="16" rows="5">{{psc_obj.modules}}</textarea>
	</td>
    <td><input type="text" name="core_elective" id="core_elective" value="{{psc_obj.core_elective}}" style="width:30px"   /></td>
    <!--<td><input type="text" name="coursecode" id="coursecode" value="" class="saminput" /></td>
    <td><input type="text" name="season" id="season" value="" style="width:40px;" /></td>
    <td><input type="text" name="year" id="year" value="" style="width:40px;" /></td>-->
    <td width="150">Day 1:<input type="text" name="class_start" id="class_start" value="{{psc_obj.class_start|date:'d/m/Y'}}" class="saminput" /><br>
	Day 2:<input type="text" name="class_end" id="class_end" value="{{psc_obj.class_end|date:'d/m/Y'}}" class="saminput" /><br>
	Day 3:<input type="text" name="class_date3" id="class_date3" value="{{psc_obj.class_date3|date:'d/m/Y'}}" class="saminput" /><br>
	Day 4:<input type="text" name="class_date4" id="class_date4" value="{{psc_obj.class_date4|date:'d/m/Y'}}" class="saminput" /><br>
	Day 5:<input type="text" name="class_date5" id="class_date5" value="{{psc_obj.class_date5|date:'d/m/Y'}}" class="saminput" /><br>
	</td>
    <td><input type="text" name="lecture" id="lecture" value="{{psc_obj.lecture}}" class="saminput" /></td>
    <td>
		<textarea name="textbook" id="textbook" cols="18" rows="5">{{textbook}}</textarea>
	</td>
    <td width="80"><input type="text" name="venue" id="venue" value="{{psc_obj.venue}}"  style="width:80px;" /></td>
    <td>
    <select name="status" id="status" onchange="javascript:setvalue();">
	<option value="Waived" {%ifequal psc_obj.status 'Waived'%}selected{%endifequal%}>Waived</option>
	<option value="Defer" {%ifequal psc_obj.status 'Defer'%}selected{%endifequal%}>Defer</option>
	<option value="Completed" {%ifequal psc_obj.status 'Completed'%}selected{%endifequal%}>Completed</option>
	<option value="Upcoming" {%ifequal psc_obj.status 'Upcoming'%}selected{%endifequal%}>Upcoming</option>
	<option value="Studied" {%ifequal psc_obj.status 'Studied'%}selected{%endifequal%}>Studied</option>
	<option value="Taiwan" {%ifequal psc_obj.status 'Taiwan'%}selected{%endifequal%}>Taiwan</option>
	<option value="NA" {%ifequal psc_obj.status 'NA'%}selected{%endifequal%}>NA</option>
	<option value="Online" {%ifequal psc_obj.status 'Online'%}selected{%endifequal%}>Online</option>
	</select>
	<br />
	Module name of Taiwan:<br /><input type="text" name="taiwankemu" id="taiwankemu" value="{{psc_obj.taiwankemu}}" />
	<br />

	</td>
    <td><input type="text" name="dateofdefer" id="dateofdefer" value="{{psc_obj.dateofdefer}}" class="saminput" /></td>
    <td><input type="text" name="attoch" id="attoch" value="{{psc_obj.attoch}}" class="saminput" /></td>
  </tr>

  <tr>
    <td colspan="14">
	<input type="hidden" name="pcsid" id="pcsid" value="{{psc_obj.id}}" />
	<input type="submit" name="gosave" value=" Save " />&nbsp;&nbsp;<input type="button" name="goback" value=" Back " onclick="history.go(-1)"/></td>
  </tr>
</table>
</form>
  </table>
{% endblock %}
